<template>
	<view class="container">
		<view class="list-cell b-b m-t" @click="putPhoto" hover-class="cell-hover" :hover-stay-time="50">
			<text class="cell-tit">头像</text>
			<image class="userImg" :src="userInfo.avatar || '/static/missing-face.png'"></image>
		</view>
		<view class="list-cell b-b m-t" @click="navTo('/pages/setting/amend?id=0')" hover-class="cell-hover" :hover-stay-time="50">
			<text class="cell-tit">昵称</text>
			<text class="cell-more mallicon icon-you"></text>
		</view>
		<view class="list-cell b-b m-t" @click="navTo('/pages/setting/amend?id=1')" hover-class="cell-hover" :hover-stay-time="50">
			<text class="cell-tit">手机号码</text>
			<text class="cell-more mallicon icon-you"></text>
		</view>
		<view class="list-cell b-b" @click="navTo('/pages/address/address?AddressID=0')" hover-class="cell-hover"
		 :hover-stay-time="50">
			<text class="cell-tit">收货地址</text>
			<text class="cell-more mallicon icon-you"></text>
		</view>
		<!-- <view class="list-cell" @click="navTo('修改密码')" hover-class="cell-hover" :hover-stay-time="50">
			<text class="cell-tit">修改密码</text>
			<text class="cell-more mallicon icon-you"></text>
		</view> -->
		<view class="list-cell" @click="navTo('/pages/myShop/business')" hover-class="cell-hover" :hover-stay-time="50">
			<text class="cell-tit">申请店铺</text>
			<text class="cell-more mallicon icon-you"></text>
		</view>
		<!-- <view class="list-cell" @click="navTo('建议反馈')" hover-class="cell-hover" :hover-stay-time="50">
			<text class="cell-tit">建议反馈</text>
			<text class="cell-more mallicon icon-you"></text>
		</view>
		<view class="list-cell" @click="navTo('联系客服')" hover-class="cell-hover" :hover-stay-time="50">
			<text class="cell-tit">联系客服</text>
			<text class="cell-more mallicon icon-you"></text>
		</view>
		<view class="list-cell b-b" @click="navTo('about')" hover-class="cell-hover" :hover-stay-time="50">
			<text class="cell-tit">关于我们</text>
			<text class="cell-more mallicon icon-you"></text>
		</view> -->
		<view class="list-cell">
			<text class="cell-tit">检查更新</text>
			<text class="cell-tip">当前版本 1.0.3</text>
			<text class="cell-more mallicon icon-you"></text>
		</view>
		<view class="list-cell log-out-btn" @click="toLogout">
			<text class="cell-tit">退出登录</text>
		</view>
	</view>
</template>

<script>
	import {
		mapMutations
	} from 'vuex';
	export default {
		data() {
			return {
				userInfo: {
					avatar: ''
				},
			};
		},
		onLoad() {
			this.getNews()
		},
		methods: {
			...mapMutations(['logout']),

			navTo(url) {
				uni.navigateTo({
					url
				})
			},
			//退出登录
			toLogout() {
				let that = this;
				uni.showModal({
					content: '确定要退出登录么',
					success: (e) => {
						if (e.confirm) {
							//  		this.logout();
							// this.$utils.showMsg('账号退出成功');
							// // this.$utils.prePage();
							// uni.navigateBack();  
							uni.removeStorage({
								key: 'token'
							});
							that.$utils.showMsg('退出成功');
							setTimeout(() => {
								uni.navigateTo({
									url: '/pages/login/login'
								});
							}, 1500);
						}
					}
				});
			},
			// 获取用户信息
			getNews() {
				let that = this;
				that.$Request.post(that.$api.userNews.info).then(res => {
					console.log('获取用户信息', res)
					that.userInfo = res.data
				}, err => {
					uni.navigateTo({
						url: '/pages/login/login'
					});
					console.log("err: " + JSON.stringify(err));
				});
			},
			//更换头像
			putPhoto() {
				let that = this;
				console.log('更换');
				uni.chooseImage({
					count: 1,
					sizeType: ['original', 'compressed'],
					sourceType: ['album'],
					success: function(res) {
						console.log(res);
						uni.showLoading({
							title: '加载中'
						});
						if (res.errMsg == 'chooseImage:ok') {
							console.log('ok');
							that.userInfo.avatar = res.tempFilePaths[0];

							let tempFilePaths = res.tempFilePaths;
							uni.uploadFile({
								url: 'https://0500.t1.nethhw188.com/api/member/index/upload' + '?token=' + uni.getStorageSync('token'), //仅为示例，非真实的接口地址
								filePath: tempFilePaths[0],
								name: 'image',
								formData: {
									'image': 'test'
								},
								success: (resTwo) => {
									resTwo.data = JSON.parse( resTwo.data );
									uni.hideLoading();
									uni.showToast({
										icon: 'none',
										title: '头像上传成功'
									});
									console.log(resTwo.data,'头像上传成功1111111111',resTwo.data.info);
									console.log('头像上传成功3232',resTwo);
									if (resTwo.data.code == 1) {
										//修改头像
									console.log('头像上传成功44456',resTwo.data.data.img_url);
										that.$Request.post(that.$api.user.updateInfo, {
												avatar: resTwo.data.data.img_url
											})
											.then(resThree => {
									console.log('上传头像2222222222222222');
												console.log('上传头像====>>', resThree);
												that.$Request.post(that.$api.user.info).then(resFour => {
													// console.log(resFour,111);
													if (resFour.code === 1) {
														// console.log('更新===>>', resFour);
														that.userInfo = resFour.data;
														// uni.setStorageSync('userInfo', resFour.data);
														// that.$store.state.userInfo = resFour.data;
														uni.hideLoading();
														that.$utils.showMsg('更新成功');
													}
												});
											});
									}
								}
							});
						}
					}
				});
			}
		}
	}
</script>

<style lang='scss'>
	page {
		background: $page-color-base;
	}

	.userImg {
		width: 100rpx;
		height: 100rpx;
		border-radius: 50%;
	}

	.list-cell {
		display: flex;
		align-items: center;
		padding: 20upx $page-row-spacing;
		line-height: 60upx;
		position: relative;
		background: #fff;
		justify-content: center;

		&.log-out-btn {
			margin-top: 40upx;

			.cell-tit {
				color: $uni-color-primary;
				text-align: center;
				margin-right: 0;
			}
		}

		&.cell-hover {
			background: #fafafa;
		}

		&.b-b:after {
			left: 30upx;
		}

		&.m-t {
			margin-top: 16upx;
		}

		.cell-more {
			align-self: baseline;
			font-size: $font-lg;
			color: $font-color-light;
			margin-left: 10upx;
		}

		.cell-tit {
			flex: 1;
			font-size: $font-base + 2upx;
			color: $font-color-dark;
			margin-right: 10upx;
		}

		.cell-tip {
			font-size: $font-base;
			color: $font-color-light;
		}
	}
</style>
